<{include file="Public:header" /}>
<div id="page-wrapper">
	<div class="row">
		<div class="col-lg-12">
			<h1 class="page-header" style="margin-top: 0px;"></h1>
		</div>
		<!-- /.col-lg-12 -->
	</div>
	<div class="row">
		<div class="col-lg-12">
			<div class="panel panel-default">
				<div class="panel-heading">
					<b>广场管理</b>
				</div>
				<!-- /.panel-heading -->
				<div class="panel-body">
					<div class="dataTable_wrapper">
						<div id="dataTables-example_wrapper"
							class="dataTables_wrapper form-inline dt-bootstrap no-footer">
							<div class="row">

								<div class="col-sm-6">
									<form action="<{:Url('index/Place/square')}>" method="get">
										<div class="dataTables_filter" style="float: left;">
											<label>广场名称: <input type="search" name="name"
												class="form-control input-sm" placeholder="">
											</label>
											<button class='btn btn-primary'>查询</button>
										</div>
									</form>
									<button class='btn btn-success'
										style="float: left; margin-left: 6px" onclick="addsquare()">添加广场</button>
								</div>
								<div class="row">
									<div class="col-sm-12">
										<table id=""
											class="table table-striped table-bordered table-hover dataTable no-footer">
											<thead>
												<tr role="row">
													<th tabindex="0" style="width: 40px; text-align: center;">所属城市</th>
													<th style="width: 80px; text-align: center;">广场名称</th>

													<th tabindex="0" style="width: 80px; text-align: center;">ap数量</th>

													<th tabindex="0" style="width: 80px; text-align: center;">操作</th>

												</tr>
											</thead>
											<tbody>
												<{volist name="list" id='vo' }>
												<tr class="gradeA odd" role="row">
													<td><{$vo.location_name}></td>
													<td><{$vo.campus_name}></td>
													<td><{notempty name="vo.cnt" }> <{$vo.cnt}> <{else
														/}>0 <{/notempty}></td>
													<td><a href="javascript:void(0)"
														onclick="eduitsquare('<{$vo.id}>','<{$vo.campus_name}>','<{$vo.campus_address}>','<{$vo.location_id}>','<{$vo.parent_location_id}>','<{$vo.ip}>','<{$vo.dataport}>','<{$vo.rtcport}>')">编辑</a>
														| <a href="javascript:void(0)"
														onclick="deletesquare('<{$vo.id}>')">删除</a></td>
												</tr>
												<{/volist}>

											</tbody>
										</table>
									</div>
								</div>
								<div class="row">
									<div class="col-sm-12">
										<div class='pages'><{$list->render()}></div>
									</div>
								</div>
							</div>
						</div>
					</div>
					<!-- /.panel-body -->
				</div>
				<!-- /.panel -->
			</div>
			<!-- /.col-lg-12 -->
		</div>

	</div>
	<!-- 添加广场信息-->
	<div id="addsquare" class="hide">
		<form class="form-horizontal">
			<div class="row">
				<div class="control-group span8">

					<label class="control-label" style="width: 80px; padding-top: 0px;">广场名称：</label>
					<div class="controls">
						<input type="text" style="width: 200px; height: 30px;"
							name="square" id="square" class="form-control input-sm" />
					</div>
					<!--   <div class="control-group span11">

                  <label class="control-label" style="width: 80px; padding-top: 0px;">服务器IP：</label>
                  <div class="controls">
                      <input type="text" style="width:200px;height:30px;"  name="ip" id="ip"  class="form-control input-sm"/>
                  </div>
              </div>
              <div class="control-group span11">

                  <label class="control-label" style="width: 80px; padding-top: 0px;">数据端口：</label>
                  <div class="controls">
                      <input type="text" style="width:200px;height:30px;" id="dataport" placeholder="数据端口" name="dataport"  class="form-control input-sm"/>
                  </div>
              </div>
              <div class="control-group span11">

                  <label class="control-label" style="width: 80px; padding-top: 0px;">配置端口：</label>
                  <div class="controls">
                      <input type="text" style="width:200px;height:30px;" id="rtcport" placeholder="配置端口号" name="rtcport"  class="form-control input-sm"/>
                  </div>
              </div> -->
					<div class="control-group span12">
						选择地区： <select name="pro" id="pro">
							<option>请选择</option> <{volist name='pro' id='vo' }>

							<option value="<{$vo.location_id}>">
										<{$vo.location_name}>
									</option> <{/volist}>

						</select> <select name="city" id="city">
						</select>
					</div>
					<div class="control-group span8">

						<label class="control-label"
							style="width: 80px; padding-top: 0px;">详细地址：</label>
						<div class="controls">
							<input type="text" style="width: 200px; height: 30px;"
								name="campus_address" id="campus_address"
								class="form-control input-sm" />
						</div>
					</div>
		</form>
	</div>

	<!--编辑广场信息-->
	<div id="eduitsquare" class="hide">
		<form class="form-horizontal">
			<div class="row">
				<div class="control-group span8">

					<label class="control-label" style="width: 80px; padding-top: 0px;">广场名称：</label>
					<div class="controls">
						<input type="text" name="square1"
							style="width: 220px; height: 30px;" id="square1"
							class="input-normal control-text" />
					</div>
					<div class="control-group span11">

						<label class="control-label"
							style="width: 80px; padding-top: 0px;">服务器IP：</label>
						<div class="controls">
							<input type="text" style="width: 200px; height: 30px;" name="ip1"
								id="ip1" class="form-control input-sm" />
						</div>
					</div>
					<div class="control-group span11">

						<label class="control-label"
							style="width: 80px; padding-top: 0px;">数据端口：</label>
						<div class="controls">
							<input type="text" style="width: 200px; height: 30px;" id="port1"
								name="port1" class="form-control input-sm" />
						</div>
					</div>
					<div class="control-group span11">

						<label class="control-label"
							style="width: 80px; padding-top: 0px;">配置端口：</label>
						<div class="controls">
							<input type="text" style="width: 200px; height: 30px;"
								id="rtcport1" name="rtcport1" class="form-control input-sm" />
						</div>
					</div>
					<div class="control-group span12">
						选择地区: <select name="pro1" id="pro1"> <{volist name='pro'
							id='vo' }>

							<option value="<{$vo.location_id}>">
											<{$vo.location_name}>
										</option> <{/volist}>

						</select> <select name="city1" id="city1">
						</select>
					</div>
					<div class="control-group span8">

						<label class="control-label"
							style="width: 80px; padding-top: 0px;">详细地址：</label>
						<div class="controls">
							<input type="text" style="width: 220px; height: 30px;"
								name="campus_address1" id="campus_address1"
								class="input-normal control-text" />
						</div>
					</div>
				</div>
		</form>
	</div>

	<script src="__PUBLIC__/js/jquery.js" type="text/javascript"></script>
	<script src="__PUBLIC__/js/bui.js"></script>
	<script type="text/javascript">
		//添加建筑
		var Overlay = BUI.Overlay;

		function addsquare() {
			var dialog = new Overlay.Dialog({
				title : '新增广场信息',
				width : 550,
				height : 400,
				closeAction : 'destroy', //每次关闭dialog释放
				contentId : 'addsquare',
				buttons : [ {
					text : '确定',
					elCls : 'button button-primary',
					handler : function() {
						$location_id = $('#city').val();
						$campus_name = $('#square').val();
						$campus_address = $('#campus_address').val();
						$ip = $('#ip').val();
						$port = $('#dataport').val();
						$rtcport = $('#rtcport').val();
						$.post('<{:Url("index/Place/ajaxsquare")}>', {
							'location_id' : $location_id,
							'campus_name' : $campus_name,
							'ip' : $ip,
							'rtcport' : $rtcport,
							'dataport' : $port,
							'campus_address' : $campus_address
						}, function(data) {
							if (data) {
								dispoint("新增广场信息成功");
								dialog.close();
								location.reload();
							} else {
								dispoint("新增广场信息失败");
							}
						})
					}
				}, {
					text : '取消',
					elCls : 'button',
					handler : function() {
						this.close();
					}
				} ]
			});
			dialog.show();
		}

		//编辑

		//编辑
		function eduitsquare(id, campus_name, campus_address, location_id,
				parent_location_id, ip, dataport, rtcport) {
			// alert(parent_location_id);
			$('#pro1').val(parent_location_id);
			getcity(parent_location_id, location_id);
			$('#city1').val(location_id);
			$('#square1').val(campus_name);
			$('#campus_address1').val(campus_address);
			$('#ip1').val(ip);
			$('#port1').val(dataport);
			$('#rtcport1').val(rtcport);
			var dialog = new Overlay.Dialog({
				title : '修改广场信息',
				width : 450,
				height : 400,
				closeAction : 'destroy', //每次关闭dialog释放
				contentId : 'eduitsquare',
				buttons : [ {
					text : '提交修改',
					elCls : 'button button-primary',
					handler : function() {
						$location_id = $('#city1').val();
						$campus_name = $('#square1').val();
						$campus_address = $('#campus_address1').val();
						$ip = $('#ip1').val();
						$port = $('#port1').val();
						$rtcport = $('#rtcport1').val();
						$.post("<{:Url('index/Place/ajaxeduitsquare')}>", {
							'id' : id,
							'campus_name' : $campus_name,
							'campus_address' : $campus_address,
							'ip' : $ip,
							'dataport' : $port,
							'rtcport' : $rtcport,
							'location_id' : $location_id
						}, function(data) {
							if (data) {
								dispoint("修改广场信息成功");
								dialog.close();
								location.reload();
							} else {
								dispoint("修改广场信息失败");
							}
						})
					}
				}, {
					text : '取消',
					elCls : 'button',
					handler : function() {
						this.close();
					}
				} ]
			});
			dialog.show();
		}

		//删除
		function deletesquare(id) {
			$.ajax({
				type : "post",
				url : "<{:Url('index/Place/ajaxdeletesquare')}>",
				async : true,
				dataType : 'json',
				data : {
					'id' : id
				},
				success : function(result) {
					if (result) {
						dispoint("删除广场信息成功");
						window.location.reload();
					}
				}
			});
		}

		$('#pro')
				.click(
						function() {
							$location_id = $('#pro').val();
							$city = $('#city');
							$city.empty();
							$
									.ajax({
										type : "post",
										url : "<{:Url('index/Place/ajaxGetAreasByCityId')}>",
										async : true,
										dataType : 'json',
										data : {
											'location_id' : $location_id
										},
										success : function(result) {
											$
													.each(
															result,
															function(index,
																	array) {

																var option = "<option value='" + array['location_id'] + "'>"
																		+ array['location_name']
																		+ "</option>";
																$city
																		.append(option);
															});
										}
									});
						})
		//
		$(function() {
			getcity();
		})

		$('#pro1').click(function() {
			getcity();
		})

		function getcity(parent_location_id, location_id) {
			if (parent_location_id) {
				$location_id = parent_location_id;
			} else {
				$location_id = $('#pro1').val();
			}
			if (location_id) {
				$location_ids = location_id;
			} else {
				$location_ids = '';
			}

			$city1 = $('#city1');
			$city1.empty();
			$
					.ajax({
						type : "post",
						url : "<{:Url('index/Place/ajaxGetAreasByCityId')}>",
						async : true,
						dataType : 'json',
						data : {
							'location_id' : $location_id
						},
						success : function(result) {
							$
									.each(
											result,
											function(index, array) {
												if (array['location_id'] == $location_ids) {
													var option = "<option selected='selected'  value='" + array['location_id'] + "'>"
															+ array['location_name']
															+ "</option>";
												} else {
													var option = "<option  value='" + array['location_id'] + "'>"
															+ array['location_name']
															+ "</option>";
												}

												$city1.append(option);
											});
						}
					});
		}

		function dispoint(messge) {
			BUI.Message.Show({
				msg : messge,
				icon : 'success',
				buttons : [],
				autoHide : true,
				autoHideDelay : 1000

			});
		}
	</script>
	<{include file="Public:footer" /}>